.container {
    display: flex;
    flex-direction: column;
/*    justify-content: center;*/
    align-items: center;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
}

.title {
    font-size: 38px;
    text-align: center;
    width: 100%;
    height: 40%;
    margin: 10px;
}
.videocom{
    height: 420px;
    width: 100%;
/*    background-color: black;*/
}


.boycom{
    height: 60%;
    display: flex;
    flex-direction: column;

}
.progresscom {
    height: 40%;
    width: 100%;
    align-items: center;
    justify-content: center;
}

.text01{
    font-size: 40px;
    text-align: center;
    color: cornflowerblue;
}
.text02{
    font-size: 90px;
    text-align: center;
    color: cornflowerblue;
}
.min-progress{

    stroke-width:30px;
    scale-width:3px;
    scale-number:80;
    padding: 18px 40px;
}

.slidercom{
    border-top:1px solid grey;
    display: flex;
    margin-top: 20px;
    padding-top: 40px;
    flex-direction: row;
    height: 30%;
}

.slidercom > text{
    width: 150px;
    text-align: center;
}

.firsttext{
    margin-left: 20px;
}

.slidercom slider{

}


.buttonss{
    height: 30%;
    display: flex;
    flex-direction: column;
    margin-bottom: 40px;
}
.buttonss div{
    justify-content: center;
    align-items: center;
    display: flex;
    flex-direction: row;
}
.buttonss div div{
    width: 33%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.buttonss div div image{
    height: 90px;
    width: 90px;

}
image{
    margin-bottom: 20px;
}
